/* GENERAL STYLE */
/* << */
:root {
    --blue1: #51A1F8;
    --blue2: #85bdfa;
    --blue3: #cae3fd;
    --green1: #D3FB66;
    --green2: #E0FC94;
    --green3: #F6FDDF;
    --gray1: #dddddd;
    --gray2: #e8e8e8;
}

/* account matchmaking style << */
.twitter-typeahead {
    width: 100%;
}
.tt-menu {
    background-color: #ffffff;
    border: 1px solid #dfdfdf;
    margin-top: -13px;
    padding: 10px;
}
/* >> */

.bg-color1 { background-color: var(--blue1); }
.bg-color2 { background-color: var(--blue2); }
.bg-color3 { background-color: var(--blue3); }
.bg-gray1 { background-color: var(--gray1); }
.bg-lightGray { background-color: var(--gray2); }

.maxWidth1920 { max-width: 1920px; }
.maxWidth620 { max-width: 620px; }
.maxWidth1240 { max-width: 1240px; }
.maxWidth980 { max-width: 980px; }

.body img:not(.body form img) {
    display: block;
    width: 100%;
}
.body * {
    font-family: forma-djr-micro, Arial, Helvetica, sans-serif;
    color: #000000;
    box-sizing: border-box;
}
html { scroll-padding-top: 80px; }
.body h1, .body h2, .body h3, .body h4, .body h5, .body h6 {
    color: #000000;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

.btn.btn-dark {
    background-color: #000000;
    color: #ffffff;
    border-radius: 0;
    padding-left: 30px;
    padding-right: 30px;
}

.p33 {
    padding: 23px;
}
.px33 {
    padding-left: 23px;
    padding-right: 23px;
}
.py33 {
    padding-top: 23px;
    padding-bottom: 23px;
}

/* font sizes - adding values for mobiles first and adapting with media queries for desktops */
.font11 { font-size: 11px; }
.font14 { font-size: 14px; }
.font18 { font-size: 16px; }
.font20 { font-size: 18px; }
.font22 { font-size: 20px; }
.font24 { font-size: 22px; }
.font30 { font-size: 24px; }
.font38 { font-size: 30px; }
.font58 { font-size: 38px; }
.font80 { font-size: 50px; }
/* >> */

/* BANNERS */
/* << */
.logos {
    margin-top: calc(14% + 1.5vw);
}
.hpLogo {
    max-width: 48px;
    min-width: 38px;
    width: 100%;
}
.bannerBgd {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.bannerContentTurnkey {
    max-width: 1220px;
}
.accLogoBox {
    max-width: 190px;
}
/* >> */

/* STRIPES */
/* << */
.CTABox {
    margin: 0 10px;
}
.simpleBlackStripe {
    background-color: #000000;
    color: #ffffff;
}
.simpleBlackStripe p {
    color: #ffffff;
}
.turnkeyNav .navbar {
    z-index: 1;
}
.stickyNav {
    position: sticky;
    top: 0;
    z-index: 1;
}
.turnkeyNav .navbar-toggler-bar {
    display: block;
    border: 3px solid black;
    width: 32px;
    margin: 5px;
}
.turnkeyNav .navbar-toggler:focus, .turnkeyNav .navbar-toggler:focus-visible {
    outline: none;
    box-shadow: none;
}
.turnkeyNav .nav-item {
    border-top: 1px solid #cacaca;
    border-bottom: 1px solid #cacaca;
}
#turnkeyNavContent {
    position: absolute;
    top: 100%;
    left: 0;
}
#turnkeyNavContent ul {
    min-width: 250px;
}
#turnkeyNavContent .nav-link {
    text-align: center;
}
#turnkeyNavContent .nav-link.active {
    color: #165dba;
}
.turnkeyPage {
    display: none;
}
.turnkeyPage.active {
    display: block;
}
/* >> */

/* HEADERS */
/* << */
.headerUnderline {
    border-bottom: 1px solid #3f3f3f;
}
/* >> */

/* CONTENT */
/* << */
.upperContainer {
    
}
.pdfCover {
    /* padding: 10%; */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    flex-basis: 333px;
    max-height: 333px;
    flex-grow: 1;
}
.rightColumn60 {
    min-width: 60%;
}
.objectFit {
    object-fit: cover;
}
/* >> */

/* OWL CAROUSEL */
/* << */
.carouselBox {
    border: 1px solid gray;
}
#someCarousel {
    position: relative;
    padding-top: 40px;
}
.owl-nav {
    position: absolute;
    top: 0;
    right: 0;

}
.owl-nav button.owl-next, .owl-nav button.owl-prev {
    border: 1px solid black !important;
    width: 24px;
    height: 24px;
}
.owl-nav button.owl-prev {
    margin-right: 40px;
}
.owl-nav button.owl-prev.disabled, .owl-nav button.owl-next.disabled {
    border-color: #cacaca !important;
    color: #cacaca;
    cursor: default;
}
.owl-nav button.owl-prev.disabled span, .owl-nav button.owl-next.disabled span {
    color: #cacaca;
}
.owl-stage { 
    display: flex;
}
.carouselBox {
    height: 100%;
    padding: 12px;
}
h4.carouselHeader {
    margin-top: 20px;
}
/* dots made look like a bar */
#someCarousel .owl-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    border-radius: 18px;
    overflow: hidden;
    height: 5px;
}

#someCarousel .owl-dot {
    background: #888;
    height: 10px;
    width: 100%;
    margin: 0;
    cursor: pointer;
}
#someCarousel .owl-dot.active {
    background: #333;
} 
/* >> */

/* CONTACT */
/* << */
.contactImg {
    max-width: 96px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 20px;
}
.contactImg2 {
    max-width: 96px;
    border-radius: 50%;
    overflow: hidden;
}
.contactRow {
    flex-direction: column;
}
.formModal {
    overflow-y: hidden;
}
.formWrapper {
    overflow-y: auto;
    padding: 0;
    height: 90vh;
}
.closeBox {
    position: sticky;
    top: 0;
    height: 0;
}
.formWrapper span.closeX {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    width: 30px;
    height: 30px;
    display: block;
    float: none;
}
/* bootstrap modal */
.modal-header {
    align-items: flex-start;
}
.btn-close {
    height: auto;
    width: auto;
    background: none;

}
/* >> */

/* FOOTNOTES */
/* << */
.footnotesHeader {
    margin: 0;
}
.footnotesHeader .accordion-button {
    color: #000000;
    border-color: unset;
    background-color: unset;
}
.footnotesHeader .accordion-button:focus {
    color: #000000;
    border-color: unset;
    background-color: unset;
    box-shadow: none;
}
.footnotesHeader .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
#footnotesContent {

}
/* >> */

/*************************************/
/* MEDIA QUERIES */
@media only screen and (min-width: 400px) {
    /* GENERAL */
    .font58 { font-size: 42px; }
    .font80 { font-size: 60px; }

    /* CONTACT */
    .contactRow {
        flex-direction: row;
    }
}
@media only screen and (min-width: 720px) {
    .p33 {
        padding: 33px;
    }
    .px33 {
        padding-left: 33px;
        padding-right: 33px;
    }
    .py33 {
        padding-top: 33px;
        padding-bottom: 33px;
    }
}
@media only screen and (min-width: 768px) {
    /* GENERAL */
    .font18 { font-size: 18px; }
    .font20 { font-size: 20px; }
    .font22 { font-size: 22px; }
    .font30 { font-size: 26px; }
    .font38 { font-size: 34px; }
    .font58 { font-size: 48px; }

    /* HEADERS */
    #turnkeyNavContent {
        position: relative;
    }
    .turnkeyNav .nav-item {
        border-top: 0;
        border-bottom: 0;
    }

    /* CONTENT */
    .maxWidth480-md {
        max-width: 480px;
    }
    .maxWidth1100-md {
        max-width: 1100px;
    }
}
@media only screen and (min-width: 1024px) {
    /* GENERAL */
    .font24 { font-size: 24px; }
    .font30 { font-size: 30px; }
    .font38 { font-size: 38px; }
    .font58 { font-size: 58px; }
    .font80 { font-size: 80px; }
}
@media only screen and (min-width: 1240px) {
    /* GENERAL */
    .p33 {
        padding: 12px;
    }
    .px33 {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* CONTENT */
    .customMargin {
        margin-left: calc((100% - 1240px) / 2);
    }
    
}